<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<style>
    .gray{background: #CCC;
    }
    #thick{
        font-weight: bloder;
    }

</style>
<body>
    <div>test word.</div>
    <script>
    var ele=document.getElementsByTagName('div')[0];
    console.log('未操作前属性个数：'+ele.attributes.length);
    ele.setAttribute('align', 'center');
    ele.setAttribute('title','测试文字');
    ele.setAttribute('class','gray');
    ele.setAttribute('id','thick');
    ele.setAttribute('style','font-size:24px; border:1px solid green;');
    console.log('添加属性后的属性个数:'+ele.attributes.length);
    console.log('获取style属性值：'+ele.getAttribute('style'));
    ele.removeAttribute('style');
    console.log('查看所有属性：');
    for(var i=0; i<ele.attributes.lngth;++i){
        console.log(ele.attributes[i]);
    }
    </script>
    <p><a href="7.html">返回上一页</a></p>
</body>
</html>